/**
 * Created by lee_mxue on 17/6/26.
 */
import React from "react";
import ReactDOM from "react-dom";
import AJAX from "../../lib/ajax";
import Rules from "../../lib/rules";
import Toast from "../MyPackage/components/Toast";
import Tools from "../../lib/tools";
import { addErrorListener } from "../../lib/handleError"
import weixinShare from "../../lib/weixinShare";
import Dialog from "../MyPackage/components/Dialog";

require('../../lib/rem');
require('./EditOtherReceiver.less');
require('../../styles/common.less');
require('../../styles/lux.less')
//判断寄件类型（1: 服务站点寄件    2: 柜体寄件）
const sendType = Tools.getParams().send_type;
class App extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            isReady: false,     //是否加载页面
            hasData: false,     //是否带有数据（true：编辑页面   false：添加页面）
            receiverId: "",   //收件人id
            receiverName: "",   //收件人姓名
            receiverPhone: "",  //收件人电话
        };
        this.getReceiverInfo = this.getReceiverInfo.bind(this)  //获取输入框内容
        this.handleClearInfo = this.handleClearInfo.bind(this)  //清楚输入框内容
        this.handleDelete = this.handleDelete.bind(this)  //删除
        this.handleSubmit = this.handleSubmit.bind(this)  //提交
    }

    componentWillMount() {
        addErrorListener()()
        //隐藏分享功能
        weixinShare.hideAll();
        var otherReceiverData_x = JSON.parse(window.localStorage.getItem("otherReceiverData_x"))
        //判断是否为空对象
        for (var key in otherReceiverData_x) {
            //不为空对象
            this.setState({
                hasData: true,   //是否带有数据（true：编辑页面   false：添加页面）
                receiverId: otherReceiverData_x.id,   //收件人id
                receiverName: otherReceiverData_x.name,   //收件人姓名
                receiverPhone: otherReceiverData_x.phone,  //收件人电话
            });
        }
    }


    componentDidMount() {
        AJAX.appendBaiduAnalysis()

        this.setState({
            isReady: true,     //是否加载页面
        })
    }


    //获取输入框内容
    getReceiverInfo(type, e) {
        var value = e.target.value
        this.setState({
            [type]: value
        })
        //编辑地址标签
        if (type == 'receiverTag') {
            var tagList = this.state.tagList;
            tagList.push(value)
            this.setState({
                tagList: tagList
            })
        }
    }

    //手动清楚输入框内容
    handleClearInfo(type) {
        this.setState({
            [type]: ""
        })
    }

    //删除
    handleDelete() {
        const order_id = Tools.getParams().order_id;
        Dialog.confirm({
            title: "提示",
            content: "确认删除代收人吗",
            okText: "确认",
            cancelText: "取消",
            onOK: ()=> {
                AJAX.request("agent_remove", {
                    agent_id: this.state.receiverId
                }, (data) => {
                    if (data.code == 0) {
                        window.location.href = './ChooseOtherReceiver?order_id=' + order_id
                    }
                })
            },
            onCancel: ()=> {
            }
        })
    }

    //提交
    handleSubmit() {
        const order_id = Tools.getParams().order_id;
        const ad_id = Tools.getParams().aditem_id;
        //    验证姓名
        if (this.state.receiverName.length == 0) {
            Toast.warn({
                content: '请输入姓名'
            });
        } else if (!Rules.len(this.state.receiverName, 2, 40)) {
            Toast.warn({
                content: '姓名格式错误'
            });
            //    验证联系方式
        } else if (this.state.receiverPhone.length == 0) {
            Toast.warn({
                content: '请输入联系方式'
            });
        } else if (!Rules.phone(this.state.receiverPhone) && !Rules.officePhone(this.state.receiverPhone)) {
            Toast.warn({
                content: '联系方式格式错误'
            });
        } else {
            //hasData（true：编辑页面   false：添加页面）
            if (this.state.hasData) {
                //    编辑
                AJAX.request("agent_edit", {
                    agent_id: this.state.receiverId,    // id
                    name: this.state.receiverName,    // 姓名
                    phone: this.state.receiverPhone,    // 电话
                }, (data) => {
                    if (data.code == 0) {
                        window.location.href = './ChooseOtherReceiver?order_id=' + order_id + "&aditem_id=" + ad_id;
                    }
                })
            } else {
                //    添加
                AJAX.request("agent_add", {
                    name: this.state.receiverName,    // 姓名
                    phone: this.state.receiverPhone,    // 电话
                }, (data) => {
                    if (data.code == 0) {
                        window.location.href = './ChooseOtherReceiver?order_id=' + order_id + "&aditem_id=" + ad_id;
                    }

                })
            }
        }

    }

    render() {
        return (
            this.state.isReady &&
            <div>
                <div className="weui-cells">
                    <div className="weui-cell">
                        <div className="weui-cell__hd"><label className="weui-label">姓名</label></div>
                        <div className="flex weui-cell__bd">
                            <input className="weui-input" value={this.state.receiverName}
                                   onChange={this.getReceiverInfo.bind(this, "receiverName")} required="required"
                                   autoComplete="autoComplete"
                                   placeholder="请输入姓名"/>
                            <i onClick={this.handleClearInfo.bind(this, "receiverName")}
                               className="iconfont iconG icon-cuowu"></i>
                        </div>
                    </div>
                    <div className="weui-cell ">
                        <div className="weui-cell__hd">
                            <label className="weui-label">联系方式</label>
                        </div>
                        <div className="flex weui-cell__bd">
                            <input className="weui-input" value={this.state.receiverPhone}
                                   onChange={this.getReceiverInfo.bind(this, "receiverPhone")} required="required"
                                   autoComplete="autoComplete" type="tel"
                                   placeholder="请输入电话号码"/>
                            <i onClick={this.handleClearInfo.bind(this, "receiverPhone")}
                               className="iconfont iconG icon-cuowu"></i>
                        </div>
                    </div>

                </div>


                <div className="weui-btn-area submit_btn">
                    <a className="confirm-btn weui-btn weui-btn_primary" onClick={this.handleSubmit} href="javascript:;"
                       id="showTooltips">立即保存</a>
                    {this.state.hasData &&
                    <a className="delete-btn weui-btn weui-btn_primary" onClick={this.handleDelete} href="javascript:;"
                       id="showTooltips">删除</a>
                    }

                </div>

            </div>

        )
    }
}
ReactDOM.render(<App />, document.getElementById('app'));
if (module.hot) {
    module.hot.accept();
}